﻿/*
Theme Name: Buetian 4.dream
Theme URI: http://code.google.com/p/buetian-dot-com-theme-wordpress
Author: seoul
Description: Theme for buetian.com and personal site
Version: 4.0.10
+
This theme, like Rokeya keyboard layout (http://code.google.com/p/bangla-keyboard-layout/) is licensed under the Apache 2.0.
Use it to make something cool, have fun, and share what you've learned with others.
*/

* {
	margin: 0;
	padding: 0;
    outline: 0;
}
h1 img { display: block; }
img { border: 0; }
a, a:visited { color: #2276BB; text-decoration: none; border: 0} /* anchor tag */
a:hover { 
color: blue;
/* text-decoration: underline; */
}

.clear { clear: both; } /* clean all floating */
.clear_left{ clear:left; } .left{float:left;}
.clear_right{ clear: right;} .right{float: right;}
.numberedUL {list-style: decimal-leading-zero;}

/* font justifications
- I prefer tahoma, small but elegent bangla font and sans-serif fonts.
- http://www.erin-lawrence.com/webfonts/ => what to use
- http://stackoverflow.com/a/535659/385205 => how to use
*/
@font-face
{
	font-family: 'Noto Sans Bengali';
	src: url(lib/NotoSansBengali-Regular.woff), url(lib/NotoSansBengali-Regular.ttf);
	font-weight: 400;
}
body {
    background:  #993300 url(images/cbg.png) repeat; /* from accentbox */
    font-size: 16px;
    font-family: tahoma, 'Noto Sans Bengali', 'Helvetica', 'Arial', sans-serif;
    padding: 10px 0 0 0;
	color: #666666;
	word-wrap:break-word;
}
blockquote {
	background: url("images/quoteIcon.gif") no-repeat scroll left top transparent;
	color: #717171;
	font-style: italic;
	margin-right: 10px;
	padding-left: 28px;
}
abbr {
	border-bottom: 1px dotted red;
}
/* inline-block div hack */
.inline_block{
    display: -moz-inline-stack;
    display: inline-block;
    zoom:1;
    _display: inline;
}
/** layout **/
#wrapper {
    text-align: left;
    margin: 0 auto;
    width: 980px;
    position: relative;
	border: 9px solid black;
}
ol,ul{ list-style-position: inside; }

/* define headers */
h1{font-size: 24px;} h2{ font-size: 18px;} h4{font-size: 12px;} h6{ font-size: 8px;}

/** header top **/
#nav {
  /*padding-top: 150px;*/
	background: black;
	background-repeat:no-repeat;
	background-position:right top;
}
#nav ul {
  height: 40px;
  line-height: 36px;
  /*border-left: 2px solid #9E9479;
  background: url(images/cta-darkblue.gif) repeat scroll 100px 50px;*/
  background-color: #423124;
}
#nav li {
  list-style: none;
  float: left;
  padding: 0 10px;
}
#nav a.home {
  text-decoration: underline;
  font-size: 28px;
}
#nav a {
  color: white;
  font-size: 16px;
}
.nav_rss{
    background: url(images/rss.png) no-repeat scroll bottom right;
    padding-right:20px;
}
#nav img.wp-post-image, #nav img{ 
	position:relative; 
	max-width: 980px; 
	max-height: 150px;
}
#nav .timeNowBuet{
	position: absolute;
	display:inline;
	z-index: 1;
	font-size: 0.7em;
	/* color: #AC1F24; /* buet logo colour */
}
/********** sidebar css starts here */
#content .right_col {
  float: right;
  width: 310px;
  padding: 0px 5px 0px 0px;
  /*border-left: red dotted medium;*/
}
#sidebarInputForm {margin-top: -5px;} 
/* common for all sidebar div */
div.sidebar_data{
    margin: 10px 0px 5px;
}
div.sidebar_data h2{
     color: #EFFFFF;
     /*background: none repeat scroll 0 0 #7D2252;*/
     background: url(images/cta-darkblue.gif) repeat scroll 0px 0px;
     margin-bottom: 5px;
     vertical-align: middle;
     text-align: left;
     padding-left: 10px;
}
.rounded a.rsswidget{
	color: #EFFFFF;
}
/* topmost advertise image on right sidebar */
div.sidebar_top_ad img{
    /*width: 310px;*/
    height:80px;
    margin: 0px 5px;
}
.sidebar_data li{
	padding-left: 10px;
}
/* follow images div */
.follow_icon{
    padding-left: 12px;
}
.follow_icon img{
    width: 32px;
    height: 32px;
    display: -moz-inline-stack;
    display: inline-block;
    zoom:1;
    _display: inline;
    margin: 5px 5px 0px 0px;
}
/* change keyboard */
.change_keyboard{
    float: right;
    font-size: 11px;
    text-decoration: none;
    vertical-align: bottom;
    margin-bottom: 2px;
}
.change_keyboard option{
    padding: 0px 5px 0px 0px;
}
/* input textbox */
#get_input, .get_input{
    height: 1.5em;
	display: inline;
    margin:5px 0px 0px 5px;
	padding-top: 3px;
	width: 95%;
}
/* custom actions radio buttons */
.customActionDivM{ padding-left: 20px;}
.customActionDivM div{
    display: -moz-inline-stack;
    display: inline-block;
    zoom:1;
    _display: inline;
    margin: 5px 5px 0px 0px;
}
.inputSearch{
    /*margin: 5px 0px 5px 10px;*/
    vertical-align: middle;
}
/* submit button */
.submit{
    font-size: 18px;
    background-color: #4235A9;
    color: white;
    width: 100px;
    height: 30px;
    margin:10px 0px 0px 120px;

}

/* tab { recent comment, categories and authors }
        tab headers */
.tabs {
	list-style:none;
	margin:0 !important;
	padding:0;
	height:30px;
	border-bottom:1px solid #060606;
}
/* single tab */
.tabs li {
	float:left;
	text-indent:0;
	margin:0 !important;
    padding: 0px 5px 0px 0px;
	list-style: none;
}
.tabs a {
	background-color: lavender;
	display:block;
	padding:2px 5px 5px 10px;
	/*width: 90px;*/
	text-align:center;
	position:relative;
	font-size: 18px;
        color: black;
        outline: none;
}

/* active tab uses a class named "selected".
it's highlight will be performed by moving the background image. */
.tabs .selected, .tabs .selected:hover, .tabs li.selected a {
	border-style: none;
        background-color: darkseagreen;
	color: white;
}
 .panes div {
    padding:5px 10px 0 5px;
    border:1px solid #999;
    border-top:0;
}

.comment_collection_sidebar li{
    /*list-style-image: url(images/comment.gif);*/
    list-style: decimal-leading-zero inside;
    padding: 5px 0px;
    border-bottom: 1px solid #E6E6E6;
}

/* my avatar or an advertise or natgeo photo of the day */
.avatar_or_ad{
    padding-left: 5px;
    cursor: pointer;
}
.avatar_or_ad ul{ width: 150px;float:right;}
.avatar_or_ad ul li{ float: left;clear:both;}
.avatar_iframe_src img{ width: 50px; margin-left: 5px;}
#iframe_container {
    width: 300px;
    height:300px;
    border-top: 2px double black;
    /*overflowX:hidden; overflow-x:hidden;*/
}
/********** sidebar css ends here */

/********** main content css starts here */
#content{
    margin-top: 8px;
}
.left_col{
    width: 650px;
    padding: 0px 5px;
    float: left;
}

/* my badges */
#badge img{
    width: 64px;
    height: 64px;
    float: left;
	margin-right: 10px;
}
#badge img.badge_collection{ margin: 10px; border: 1px solid;}
#badge .quote{
    background-color: #E8F8DD; /* #C3EDB8; */
    margin: 0px;
    width: 300px;

    /*color: black; /*midnightBlue*/
	min-height: 64px;
	overflow: hidden;
}
#badge .quote #quote_twitter{    
    width: 400px;
    max-height: 64px;
    float: right;
    overflow: hidden;
}
#badge .quote .reply_tweet{
    color: blue;
    float: right;
	padding-right: 5px;
}


/*********************** home and other post collecting page like archive/tags/categories.php */
#multiple_post{
    width: 645px;
    padding-left: 10px;
}
#multiple_post .title{
    /*min-height: 30px;*/
	margin-left: 90px;
    border-bottom: 2px solid #AAAAFF;
}
#multiple_post .title a{ 
	color: #444444;
	font-size:18px; 
	font-weight:bold; 
}
#multiple_post .title a:hover{
	color: blue;
}

/* Taken from wikipedia; */
.externalurl{
	background-image: url("");
    background-position: right center;
    background-repeat: no-repeat;
    padding-right: 13px;
}
.homepageAuthorInfo{
	font-size: small;
}
.stickyPost{
	background: none repeat scroll 0 0 #F2F7FC;
	border-top: 0px solid #000000;
	border-radius: 5px;
	padding: 0px 5px 5px 5px;
}
.post_content_main{
    margin: 15px 0px 5px 0px;
	min-height: 100px;
	line-height: 1.7em;
}
.post_content_main div.imgParent{	
    -webkit-box-shadow: 0px 0px 10px #4d4d4d;
    -moz-box-shadow: 0px 0px 10px #4d4d4d;
    box-shadow: 0px 0px 10px #4d4d4d;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -khtml-border-radius: 8px;  
    border-radius: 8px;
    border:solid white 3px;
    overflow: hidden;
	
	float: left;
	width: 80px;
    height: 80px;
	margin: 0px 10px 0px 0px;
}
.post_content_main  div.imgParent img{
	background: red;
     -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    -khtml-border-radius: 8px;  
    border-radius: 8px;
    overflow: hidden;
}
#multiple_post .title .other{ float: right;}
.excerpt_content_main{
    margin: 5px 0px 5px 0px;
	text-align: justify;
}
.excerpt_content_main p{ 
	margin-top: 10px;
	text-align: justify;
	line-height: 1.6em; 
}
#multiple_post img.attachment-150x150, #multiple_post img.avatar  { 
float: left; 
margin: 0px 10px 10px 0px; 
/*intentionally resized 150px to 80px so that it save space. Wp save every possible size in uploads, so the less the better */
width: 80px;
height: 80px;
}
.excerpt_content_main img { max-width: 600px; height: auto; }
/****************  natgeo/flickr slideshow */
.boxgrid{
	width: 300px;
	height: 260px;
	float:left;
	background:#161613;
	border: solid 2px #8399AF;
	overflow: hidden;
	position: relative;
        color: white;
}
.boxgrid img{
	position: absolute;
	top: 0;
	left: 0;
	border: 0;
}
.boxcaption{
	float: left;
	position: absolute;
	background: #000;
	height: 100px;
	width: 100%;
	opacity: .8;
	/* For IE 5-7 */
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
	/* For IE 8 */
	-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
}
 .captionfull .boxcaption {
 	top: 220px;
 	left: 0;
 }
 .caption .boxcaption {
 	top: 220px;
 	left: 0;
 }

/******************  Single contents like single.php and Page.php *****/
.post img { max-width: 600px; height: auto; }
.post{
    margin: 10px 0px 5px 0px;
    width: 645px;
    padding-left: 2px;
    /* font-family: "SiyamRupali"; */
}
.post .title{
    border-left: 5px solid #BBBBBB;
    padding-left: 5px;
}
.post .title .info h5{
    color: #BBBBBB;
	width: 95%;
    display: block;
}
.post .title h1{  color: #1D9609; }
.post .title h1:hover{ text-decoration: underline;}

.post h5.sectionHeader, h5.sectionHeader{
    border-bottom: 1px solid #990033;
    border-top: 1px solid #990033;
    padding: 2px;
    color: #990033;
    font-size: 15px;
    text-align: center;
    margin-top: 10px;
}
.post .sectionHeader1{
    border-bottom: 1px solid #990033;
    border-top: 1px solid #990033;
    padding: 2px;
    color: #990033;
    font-size: 15px;
    text-align: center;
    margin-top: 10px;
}

.relatedPost ul.elementUL{
    list-style: decimal-leading-zero inside;
    margin-left: 30px;
    margin-bottom: 20px;
}
.relatedPost li{
    padding-top: 3px;
}

/* post tags and share icons area beneath the post */
.multiple_share{
    width: 400px;
    margin: 0 auto;
    padding: 10px;
    border: 1px solid;
}
.multiple_share h3{
    display: block;
    text-align: center;
    margin-bottom: 20px;
    background-color: blue;
    color: white;
}
.multiple_share .candidate{
    padding: 5px 7px;
    vertical-align: top;
}

/*********************** Comments section ***********************/
.aligncenter,
div.aligncenter {
	display: block;
	margin: 0px auto;
}
.alignleft { float: left; }
.alignright { float: right; }

.helpCommentEditor{
    left: 500px;
    position: absolute;
    float: right;
    color: red;
    cursor: help;
}
.commentInputElement{
    float: left;
    width: 90%;
}


.leaveResponse{
    color: #006666;
    /* border-top: 5px solid #735220;
    margin-top: 4px;*/
}
.userLoginOut{
    float: right;
    width:100px;
    padding:25px 5px 0px 10px;
    border-left: 5px solid #4235A9;
    margin: 5px 10px 0px 0px;
    text-align: center;
}
.commentform #author, .commentform #email, .commentform #url, .commentform textarea {
	border: 1px solid #030303;
	padding: 5px;
	margin-right: 2px;
}
.commentform { margin-top: 20px; }

.commentform .keyboardOptionsCommentForm ul {
    margin-left: 100px;
    list-style: none;
}
.commentform .keyboardOptionsCommentForm ul li {
    float:left;
    padding-right: 10px;
}
.commentform #submit{
    margin: 0px 10px 10px 0px;
    float: left;
    width: 150px;
}
.inputCommentForm{ margin: 10px 0px; }

ul.commentlist{
    list-style: decimal outside;
    list-style-position: outside;
    padding-left: 20px;
	line-height: 1.6em;
	text-align: justify;
	margin-left: 5px;
}
.commentlist small { color: #AAAAAA; }
.commentlist .comment{ margin: 8px 0px 5px; }
.commentlist .comment .commentText{
    padding-bottom: 5px;    
}
.commentlist li .avatar {
	float: right;
	padding: 2px 2px 8px 8px;
        vertical-align: top;
}
.commentlist small a.url { font-size: 14px;}
.bypostauthor small { background-color: #DDDDFF; }

/*********************** Single.php/Page.php type post's main content section ***********************/
.mainContentSinglePost{
    margin: 15px 5px 30px 5px;
    /* border-right: 1px dotted #DDDDDD; */
	text-align: justify;
	line-height: 1.6em;
}
.mainContentSinglePost p{
    margin-bottom: 10px;
}

/*********************** Footer section ***********************/
.footer p{
    border-top: 1px solid;
    text-align: center;
    margin: 0 auto;
}
#footer{
	margin-top: 20px;
}

/*********************** common colours */
.title_blue{     background-color: blue; color: white; }
.black{     background-color: black; }
.white { background-color: white;}
.dimGray { background-color: #ECECEC;}

/*********************** css table */

div.base-layer{
    margin:5px auto;
    width:630px;
}
div.table-row {
        background:none repeat scroll 0 0 transparent;
        border:1px solid #000000;
        color: white;
        text-align:center;
        width:96%;
}
div.left-container13 {
        border: 1px solid black;
        float:left;
        width:45%;
}
div.right-container13 {
        border:1px solid black;
        float:right;
        width:50%;
}
div.space-line {
        clear:both;
        width:auto;
}
h5.colhdr{ 
    background-color: aliceblue;
    color: black;
    border-left: 1px solid black;
    border-right: 1px solid black;
}


/****************************** bng Text Editor */
.bngDivMain{
    /*background-color:#EEEEEE;*/
    display: block;
    background:  none repeat scroll 0 0 #eeeeee;
}
.bngULMain{
    list-style-type: none;
    height: 25px;
    /*padding: 0px 5px 5px 2px;*/
}
.bngULMain li{    
    float: left;
    cursor: pointer;        
    height: 16px;
    width: 16px;
    /*background-color: blue;*/
    /*background: transparent url(images/bngTextEditor.gif) no-repeat scroll -16px -16px;*/
}
.bngULMain li.icon{
    border: 1px solid red;
    margin: 2px 5px 0;
    background: red url(images/bngTextEditor.gif) no-repeat scroll -16px -16px;
}

/****************************** Content Slider */
.coin-slider { width: 600px; overflow: hidden; zoom: 1; position: relative; margin-left: 30px; }
.coin-slider a{ text-decoration: none; outline: none; border: none; }
.coin-slider a img{
	/*max-width: 600px;*/
}
.cs-buttons { font-size: 0px; padding: 10px; float: left; }
.cs-buttons a { margin-left: 5px; height: 10px; width: 10px; float: left; border: 1px solid #B8C4CF; color: #B8C4CF; text-indent: -1000px; }
.cs-active { background-color: #B8C4CF; color: #FFFFFF; }

.cs-title { width: 600px; padding: 10px; background-color: #000000; color: #FFFFFF; }

.cs-prev, 
.cs-next { background-color: #000000; color: #FFFFFF; padding: 0px 10px; }
a:hover.cs-prev,a:hover.cs-next{ background-color: black; color: yellow; padding:0 10px;} 

/* from menucool.com */
#sliderFrame {position:relative;width:700px;margin: 0 auto;} /*remove the "margin:0 auto;" if you want to align the whole slider to the left side*/
#slider {
    width:600px;height:306px;/* Make it the same size as your images */
	background:url(images/loading.gif) no-repeat 50% 50%;
	position:relative;
	margin:0 auto;/*make the image slider center-aligned */
    box-shadow: 0px 1px 5px #999999;
}
#slider img {
	position:absolute;
	border:none;
	display:none;
}

/* the link style (if an image is wrapped in a link) */
#slider a.imgLink {
	z-index:2;
	display:none;position:absolute;
	top:0px;left:0px;border:0;padding:0;margin:0;
	width:100%;height:100%;
}
/* Caption styles */
div.mc-caption-bg, div.mc-caption-bg2 {
	position:absolute;
	width:100%;
	height:auto;
	padding:0;
	left:0px; /*if the caption needs to be aligned from right, specify by right instead of left. i.e. right:20px;*/
	bottom:0px;/*if the caption needs to be aligned from top, specify by top instead of bottom. i.e. top:150px;*/
	z-index:3;
	overflow:hidden;
	background-color: #101020;
	opacity: .4;
}
div.mc-caption {
	font: bold 14px/20px;
	color:#EEE;
	z-index:4;
	padding:10px 0;/*Adding a padding-left or padding-right here will make the caption area wider than its background. Sometimes you may need to define its width again here to keep it the same width as its background area (div.mc-caption-bg).*/
	text-align:center;
}
div.mc-caption a {
	color:#FB0;
}
div.mc-caption a:hover {
	color:#DA0;
}
div.navBulletsWrapper  {
	top:310px; left:240px; /* Its position is relative to the #slider */
	width:150px;
	background:none;
	padding-left:20px;
	position:relative;
	z-index:5;
	cursor:pointer;
}

/* each bullet */
div.navBulletsWrapper div 
{
    width:11px; height:11px;
    background:transparent url(images/bullet.png) no-repeat 0 0;
    float:left;overflow:hidden;vertical-align:middle;cursor:pointer;
    margin-right:11px;/* distance between each bullet*/
    _position:relative;/*IE6 hack*/
}

div.navBulletsWrapper div.active {background-position:0 -11px;}

/****************************** archive/404 pages */
.no_sidebar_center_all{
  margin: 0 100px;
}
/****************************** only 404 page */
ul li{
   padding: 10px 0px;
}
/****************************** tiny-carousel flickr pics */
#slider-code { height: 200px; overflow:hidden; }
#slider-code .viewport { float: left; width: 260px; min-height: 200px; overflow: hidden; position: relative; margin-left:30px;}

#slider-code .overview { list-style: none; position: absolute; padding: 0; margin: 0; left: 0; top: 0; }
#slider-code .overview li{ float: left; margin: 0 20px 0 0; padding: 1px; height: 200px; border: 1px solid #dcdcdc; width: 280px;}
/********************* DEPARTMENT COLOUR CODE */
/* vibgior */
.CSE,.cse{ color: Teal; }
.EEE, .eee{ color: slateBlue; }
.ME, .me {color: blue;}
.IPE, .ipe {color: indigo;}
.NAME, .name {color: Olive;}
.WRE, .wre {color: #8B5A2A;}
.CE, .ce {color: Maroon;}
.ARCH, .arch {color: #7E8B7E;}
.URP, .urp {color: #0FbFaF;}
.CHE, .che {color: #D877EE;}
.MME, .mme {color: #8B008B; }
.MS, .ms{color: lime;}
.OTHER, .other{color: #FF2300;}
/************ single_author_info */
.single_author_info label{
font-weight: bold;
}
.single_author_info{
}
/*** google signing **/
#google_connect img{ 
	height: 25px;
	/* vertical-align: middle; */
	margin-top: 8px;
	width: 150px;
	cursor: pointer;
}
.hidden { display: none;}

div.pagination span.pages{color:#444444;}

/* Basic jQuery Slider essential styles */
ul.bjqs-slider li, ol.bjqs-markers li{margin:0px !important;}
ul.bjqs{ position:relative; list-style:none;padding:0;margin:0;overflow:hidden; display:none;}
li.bjqs-slide{position:absolute; display:none;}
ul.bjqs-controls{list-style:none;margin:0;padding:0;z-index:9999;height:0}
ul.bjqs-controls.v-centered li a{position:absolute;}
ul.bjqs-controls.v-centered li.bjqs-next a{right:0;}
ul.bjqs-controls.v-centered li.bjqs-prev a{left:0;}
ol.bjqs-markers{list-style: none; padding: 0; margin: 0; width:100%;}
ol.bjqs-markers.h-centered{text-align: center;}
ol.bjqs-markers li{display:inline;}
ol.bjqs-markers li a{display:inline-block;}
p.bjqs-caption{display:block;width:96%;margin:0;padding:2%;position:absolute;bottom:0;}


ul.bjqs-controls.v-centered li a{
	display:block;
	padding:10px;
	background:#fff;
	color:#000;
	text-decoration: none;
}

ul.bjqs-controls.v-centered li a:hover{
	background:#000;
	color:#fff;
}

ol.bjqs-markers li a{
	padding:5px 10px;
	background:#000;
	color:#fff;
	margin:5px;
	text-decoration: none;
}

ol.bjqs-markers li.active-marker a,
ol.bjqs-markers li a:hover{
	background: #999;
}

p.bjqs-caption{
	background: none repeat scroll 0 0 gray;
	color: white;
	padding: 0% 0% 4% 0%;
	width: 100%;
	text-align: center;
}

ol.bjqs-markers, ul.bjqs-controls{
	list-style: none outside none !important;
}
ul.bjqs-controls{
	margin-bottom: 15px;
}
ol.bjqs-markers{
	float: left;
	clear: both;
}
#slider-code ul li.bjqs-slide a
{
  display: block;
  width: 100%;
  position: relative;
  height: 0;
  padding: 56.25% 0 0 0;
  overflow: hidden;
}
#slider-code ul li.bjqs-slide a img
{
  position: absolute;
  display: block;
  max-width: 100%;
  
  max-height: 100%;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  margin: auto;
}
li.bjqs-slide img{min-width:650px;}
/***************************** jQuery slider */

.wp-caption{
	background: none repeat scroll 0 0 #999999;
	color: white;
	text-align: center;
}